import React, {Fragment} from 'react';
import {Card, Button, Table, message, Modal} from 'antd';
import Axios from '../../axios';

import './sys.less';

class User extends React.Component {

    state = {
        dataSource: []
    }

    componentDidMount() {
        this.getUserData();
    }

    getUserData = () => {
        Axios.ajax({
            url: '/user/list',
            baseURL: 'http://127.0.0.1:7001/api'
        }).then( res => {
            const data = res.data;
            console.log(data);
            if (data.code === 2000) {
                this.setState({
                    dataSource: data.data.list
                });
            } else if (data.code === 3000) {
                message.warn(
                    `${data.msg}`
                )
            } else {
                message.error(
                    `${data.msg}`
                )
            }
        });
    };


    render() {

        const columns = [
            {
                title: '编号',
                dataIndex: 'u_id',
                align: 'center',
            },
            {
                title: '用户名',
                dataIndex: 'u_name',
                align: 'center',
            },
            {
                title: '手机号',
                dataIndex: 'u_tel',
                align: 'center',
            },
            {
                title: '状态',
                dataIndex: 'u_state',
                align: 'center',
            },
            {
                title: '住址',
                dataIndex: 'u_addr',
                align: 'center',
            },
        ];

        return (
            <Fragment>
                <Card title={'用户管理'} className={'card-user'}>
                    <Button type={'primary'} icon={'plus'}>新增</Button>
                    <Button type={'primary'} icon={'edit'}>修改</Button>
                    <Button type={'danger'} icon={'delete'}>删除</Button>
                    <Table bordered={true}
                        dataSource={this.state.dataSource} 
                        columns={columns} />
                </Card>
            </Fragment>
        );
    }
}



export default User;